<template>
	<div class="wrap">
		<div class="waimai" @click="change1">
			<span :class="{seam:this.$route.path=='/b_'}">&#xe601;</span>
			<span>外卖</span>
		</div>
		<div class="sousuo" @click="change2">
			<span :class="{seam:this.$route.path=='/ssHeader'}">&#xe606;</span>
			<span>搜索</span>
		</div>
		<div class="dingdan" @click="change3">
			<span >&#xe600;</span>
			<span>订单</span>
		</div>
		<div class="wode" @click="change4">
			<span :class="{seam:this.$route.path=='/my'}">&#xe617;</span>
			<span>我的</span>
		</div>
	</div>
</template>

<script>
	export default {
		data:function() {
			return{

			}
		},
		methods:{
			change1:function(){
				this.$router.replace('/b_')
			},
			change2:function(){
				this.$router.replace('/ssHeader')
			},
			change3:function(){
				this.$router.replace('/')
			},
			change4:function(){
				this.$router.replace('/my')
			}
		}
	}
</script>

<style scoped>
	.wrap {
		background: white;
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		display: flex;
	}
	.wrap div {
		width: 25%;
		height: 39px;
		/* text-align: center; */
		/* line-height: 39px; */
		font-size: 12px;
		/* color: #666666; */
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.wrap div :nth-child(1) {
		font-family: 'iconfont';
		margin-top: 5px;
		font-size: 17px;
	}
	.wm {
		color: #007AFF;
	}
	.seam {
		color: #007AFF;
	}
	@font-face {
	  font-family: 'iconfont';  /* project id 1575032 */
	  src: url('//at.alicdn.com/t/font_1575032_eyxo8h0h98.eot');
	  src: url('//at.alicdn.com/t/font_1575032_eyxo8h0h98.eot?#iefix') format('embedded-opentype'),
	  url('//at.alicdn.com/t/font_1575032_eyxo8h0h98.woff2') format('woff2'),
	  url('//at.alicdn.com/t/font_1575032_eyxo8h0h98.woff') format('woff'),
	  url('//at.alicdn.com/t/font_1575032_eyxo8h0h98.ttf') format('truetype'),
	  url('//at.alicdn.com/t/font_1575032_eyxo8h0h98.svg#iconfont') format('svg');
	}
</style>
